<template>
    <div class="wrapper">
        <div class="head-img">
            <img src="..\..\assets\imgs\pics\default_head_img.jpeg" alt="用户头像">
        </div>
        <el-descriptions class="margin-top" align="center" :column="1" :size="size" border>
            <template slot="extra">
            </template>
            <el-descriptions-item>
                <template slot="label">
                    <i class="el-icon-user"></i>
                    用户名
                </template>
                {{userInfo.username}}
            </el-descriptions-item>

            <el-descriptions-item>
                <template slot="label">
                    <i class="el-icon-message"></i>
                    UID
                </template>
                {{userInfo.uid}}
            </el-descriptions-item>


            <el-descriptions-item>
                <template slot="label">
                    <i class="el-icon-message"></i>
                    绑定邮箱
                </template>
                {{userInfo.email}}
            </el-descriptions-item>
            
            
            

            
        </el-descriptions>

        <el-button type="primary" size="big" class="logout-btn" @click="notice">问题反馈</el-button>
         

        <el-button type="danger" size="big" class="logout-btn" @click="logout">退出登录</el-button>

    </div>
</template>

<script>
import cookie from '@/tools/cookie'
  export default {
    name: 'mineMain',
    components:{},
    props:{},
    data(){
      return {
          userInfo: {
            username: localStorage.getItem('pta_username') || '信息查询失败',
            email: localStorage.getItem('pta_email') || '信息查询失败',
            uid: localStorage.getItem('uid') || '信息查询失败'
          }
      }
    },
    created(){},
    mounted(){
        // console.log(cookie.allCookies)
        // cookie.addCookie('test', 123)
        // console.log(document.cookie)
        
    },
    activated(){},
    updated(){},
    methods:{
        isLoginedEmit () {
            // console.log('子向父->')
            this.$emit('changeIsLogined')
        },
        logout () {
            this.$axios.get('/back/user/logout',{
                headers: {
                    "token": localStorage.getItem('token')
                }
            }).then((res) => {
                // console.log(res.data)
                localStorage.removeItem('pta_username')
                localStorage.removeItem('pta_password')
                localStorage.removeItem('uid')
                localStorage.removeItem('pta_email')
                localStorage.removeItem('token')
                localStorage.removeItem('pta_exp')
                localStorage.removeItem('cos_sdk_upload_cache')
                this.$message({
                    message: '注销成功',
                    type: 'success'
                })
                this.isLoginedEmit()
            }).catch((err) => {
                this.$message.error('注销失败，请检查网络连接')
                console.log(err)
            })
        },
        notice () {
            this.$alert("在使用过程中，如果遇到问题可以联系开发者，QQ2779066456", "问题反馈")
        }
    },
    computed:{},
    watch:{},
  }
</script>
<style scoped>
    .head-img {
        width: 100%;
        height: 26vh;
        text-align: center;
        margin: 5vh 0;
    }
    .head-img img {
        
        height: 100%;
        border: 5px solid #999;
        border-radius: 50%;
    }
    .logout-btn {
        margin: 5vh 0;
    }
</style>